<!-- MessageReport -->
<!-- Author: Edwin -->
<template>
  <div class='c-message-report'>
    <el-table :data="reportList"
              style="width: 100%">
      <el-table-column prop="id"
                       :label="$t('custom.botStore.console.no')"
                       align="center"
                       width="180">
      </el-table-column>
      <el-table-column prop="createTime"
                       :label="$t('custom.botStore.console.timeCreated')"
                       align="center">
      </el-table-column>
      <el-table-column prop="sentTime"
                       :label="$t('custom.botStore.console.timeSent')"
                       align="center">
      </el-table-column>
      <el-table-column prop="sentTo"
                       :label="$t('custom.botStore.console.sendTo')"
                       align="center">
      </el-table-column>
      <el-table-column prop="function"
                       :label="$t('custom.botStore.console.function')"
                       align="center">
      </el-table-column>
      <el-table-column prop="message"
                       :label="$t('custom.botStore.console.message')"
                       align="center">
      </el-table-column>
      <el-table-column :label="$t('custom.botStore.console.status')"
                       align="center">
        <template slot-scope="scope">
          <el-button size="mini"
                     @click="statusBtnAction(scope.row)">{{$t('custom.botStore.console.ready')}}</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination background
                   layout="prev, pager, next"
                   :total="1000"
                   prev-text="Pre"
                   next-text="Nex"
                   :pager-count="5"
                   @current-change="changeTablePage">
    </el-pagination>
  </div>
</template>

<script>
export default {
  data () {
    return {
      reportList: [
        {
          id: 12,
          createTime: '03/31 09:51',
          sentTime: '03/31 09:51',
          sentTo: 'Edwin',
          function: 'Not Enough Words',
          message: 'Lorem lpsumLorem lpsum'
        },
        {
          id: 13,
          createTime: '03/31 09:51',
          sentTime: '03/31 09:51',
          sentTo: 'Alisa',
          function: 'Not Enough Words',
          message: 'Lorem lpsumLorem lpsum'
        },
        {
          id: 14,
          createTime: '03/31 09:51',
          sentTime: '03/31 09:51',
          sentTo: 'Nikki',
          function: 'Not Enough Words',
          message: 'Lorem lpsumLorem lpsum'
        }
      ]
    }
  },
  methods: {
    statusBtnAction (row) {
    },
    changeTablePage (e) {
    }
  }
}
</script>

<style scoped>

</style>
